<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../css/index.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../js/flexslider/flexslider.css">
    <title>首页</title>

</head>
<body>
    <div class="big">
        <!-- 页头 -->
        <header class="header">
            <a class="logo">花坊</a>
            <div class="header-right">
                <!--<a href="" class="search"><img src="../img/search.png"/></a>-->
                <a href="" class="cart"><img src="../img/cart.png"/></a>
                <a href="login.html" class="main"><img src="../img/main.png"/></a>
            </div>
        </header>

        <!-- 轮播图 -->
        <div class="flexslider lunbo">
            <ul class="slides" id="slides">

            </ul>
        </div>
        <!-- 分类图标icon -->
        <div class="icon">

            <a href="fresh_flower.html">
                <div class="icon_flower">
                    <img src="../img/icon/flower.png" />
                </div>
                <br>
                鲜花
            </a>

            <a href="ever_flower.html">
                <div class="icon_everflower" >
                    <img src="../img/icon/everflower.png" />

                </div>
                <br>
                永生花
            </a>

            <a href="">
                <div class="icon_plant" >
                    <img src="../img/icon/plant.png"/>

                </div>
                <br>
                绿植多肉
            </a>

            <a href="">
                <div class="icon_jian" >
                    <img src="../img/icon/jian.png"/>
                </div>
                <br>
                花艺周边
            </a>

            <a href="category.html">
                <div class="icon_more">
                    <img src="../img/icon/more.png"/>
                </div>
                <br>
                更多分类
            </a>

        </div>
        <!-- 间距 -->
        <div class="jianxi"></div>
        <!-- timeImg -->
        <div class="timeImg">
        </div>
        <!-- 间距 -->
        <div class="jianxi"></div>
        <!-- 鲜花商品展示 -->
        <div class="fresh">


        </div>

        <!--底部-->
        <div class="foot_1">
            <a class="btn-weak" id="btn-login" href="login.html">登录</a>
            <a class="btn-weak" id="btn-reg" href="reg.html">注册</a>
            <div class="pull-right">
                <a class="btn-weak" href="javascript:scroll(0,0)">返回顶部</a>
            </div>
        </div>

        <div class="foot_2">Copyright © 2016 洛阳花坊股份有限公司</div>

    </div><!--big-->

    <!-- 占位盒子 -->
    <div class="perch"></div>
    <!-- 页脚 -->
    <footer class="footer">
        <a href="#"><img src="../img/home.png"><br>首页</a>
        <a href="category.html"><img src="../img/class.png"><br>分类</a>
        <a href=""><img src="../img/shopping.png"><br>购物车</a>
        <a href="login.html"><img src="../img/my.png"><br>我的</a>
    </footer>
    <div id="goTop">
        <img src="../img/返回顶部.png" />
    </div>

    <script src="../js/jquery-3.1.1.js"></script>
    <script src="../js/common.js"></script>
    <script src="../js/flexslider/jquery.flexslider.js"></script>

<script>
    $(function () {

//        轮播图
        var params = {};
        params.keyword = '轮播图';
        $.get('../php/lunbo.php',params,function(data){
            var strhtl='';
            for (var i = 0; i<data.length; i++) {
                strhtl +='<li><img src="'+data[i].Img+'"></a></li>';
            }
            $('.slides').append(strhtl);
            $('.flexslider').flexslider({directionNav:false})
                    .css({'margin-bottom':'0',"border":'none'});
            $('.flex-control-nav').css({bottom:'1px',"z-index":'20'});
            $('.flex-control-paging li a').css({'width':'5px',"height":'5px','border-radius':'5px'});

        });

//        timeImg
        var params = {};
        params.keyword = '限时抢购';
        $.get('../php/lunbo.php',params,function(data){
            var strhtl='';
            for (var i = 0; i<data.length; i++) {
                if (i==0 || i==2){
                    continue
                }
                var id = encodeURIComponent(data[i].id);
                strhtl +='<a  href="detail.html?id='+id+'"><img src="'+data[i].Img+'"></a>';
            }
            $('.timeImg').append(strhtl);
        });

//        鲜花展示
        var params = {};
        params.keyword = '鲜花';
        $.get('../php/lunbo.php',params,function(data){
            var strhtl='';
            for (var i = 0; i<data.length; i++) {
                var id = encodeURIComponent(data[i].id);
                strhtl +='<a href="detail.html?id='+id+'">' +
                        '<img src="'+data[i].Img+'" height="240" width="220"/>' +
                        '<br>'+data[i].name+'<br> ' +
                        '<p class="price">￥'+data[i].price+'</p>' +
                        ' </a>';
            }
            $('.fresh').append(strhtl);

        });



    })
</script>
</body>
</html>